﻿<%@ Page Title="" Language="C#" MasterPageFile="~/Site.Master" AutoEventWireup="true" CodeBehind="List.aspx.cs" Inherits="MonkeyWarranty.Web.Suppliers.List" %>
<%@ Import Namespace="Resources" %>
<asp:Content ID="Content1" ContentPlaceHolderID="HeadContent" runat="server">
    <title><%=GlobalStrings.SuppliersList %></title>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
    <div class="row">
        <div class="col-lg-12">
            <h3><%=GlobalStrings.Suppliers %></h3>
        </div>
    </div>
    <div class="row">
        <div class="col-lg-12">
            <div class="well">
                <div class="form-inline">
                    <input class="form-control" type="text" id="name" placeholder="<%=GlobalStrings.Name %>" />
                    <asp:DropDownList ID="ddlSupplierGroups" runat="server" CssClass="form-control"></asp:DropDownList>
                    <button class="btn btn-default" type="button" id="LoadRecordsButton"><i class="fa fa-search"></i></button>
                    <button class="btn btn-default" type="button" id="ResetButton"><i class="fa fa-refresh"></i></button>
                </div>
            </div>

            <div id="SuppliersTableContainer"></div>
        </div>
    </div>
    <div class="row">
        <div class="col-lg-12">
            <p></p>
            <a class="btn btn-success" href="New.aspx"><%=GlobalStrings.AddNew %></a>
        </div>
    </div>
    
    <!-- Modal -->
    <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                    <h4 class="modal-title" id="myModalLabel">Xóa</h4>
                </div>
                <div class="modal-body" id="confirmMessage">
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
                    <button type="button" class="btn btn-primary" onclick="deleteItem()" data-dismiss="modal">Xóa</button>
                </div>
            </div>
            <!-- /.modal-content -->
        </div>
        <!-- /.modal-dialog -->
    </div>
    <!-- /.modal -->
    
    <script type="text/javascript">
        $(function () {
            $("#menu-cat").addClass("active");
            $("#menu1-cat").addClass("collapse in");
            $("#cat-sup").addClass("active");
            $("#cat1-sup").addClass("collapse in");
            $("#sup-list").addClass("active");

            //Prepare jtable plugin
            $('#SuppliersTableContainer').jtable({
                title: '',
                paging: true,
                pageSize: 15,
                sorting: true,
                defaultSorting: 'Name ASC',
                actions: {
                    listAction: 'List.aspx/SupplierListByFilter',
                    //createAction: 'List.aspx/CreateSupplier',
                    //updateAction: 'List.aspx/UpdateSupplier',
                    //deleteAction: 'List.aspx/DeleteSupplier'
                },
                fields: {
                    Id: {
                        key: true,
                        create: false,
                        edit: false,
                        list: false
                    },
                    Code: {
                        title: '<%=GlobalStrings.Code %>',
                        defaultValue: 'NCC',
                        inputClass: 'validate[required]'
                    },
                    Name: {
                        title: '<%=GlobalStrings.Name %>',
                        width: '23%',
                        inputClass: 'validate[required]'
                    },
                    SupplierGroupId: {
                        title: '<%=GlobalStrings.SupplierGroups %>',
                        width: '12%',
                        options: 'List.aspx/GetSupplierGroupOptions',
                        sorting: false
                    },
                    Phone: { title: '<%=GlobalStrings.Phone %>', sorting: false },
                    Fax: { title: '<%=GlobalStrings.Fax %>', list: false },
                    Email: { title: '<%=GlobalStrings.Email %>', sorting: false },
                    Address: { title: '<%=GlobalStrings.Address %>', sorting: false },
                    Website: { title: '<%=GlobalStrings.Website %>', list: false },
                    TaxCode: { title: '<%=GlobalStrings.TaxCode %>', list: false },
                    BankAccount: { title: '<%=GlobalStrings.BankAccount %>', list: false },
                    BankName: { title: '<%=GlobalStrings.BankName %>', list: false },
                    BankProvince: { title: '<%=GlobalStrings.BankProvince %>', list: false },
                    DirectorName: { title: '<%=GlobalStrings.DirectorName %>', list: false },
                    AccounterName: { title: '<%=GlobalStrings.AccounterName %>', list: false },
                    Description: {
                        title: '<%=GlobalStrings.Description %>',
                        width: '40%',
                        type: 'textarea',
                        list: false,
                        sorting: false
                    },
                    SortOrder: { title: '<%=GlobalStrings.SortOrder %>', defaultValue: '0', inputClass: 'validate[required,custom[integer]]', sorting: false },
                    Hidden: {
                        title: '<%=GlobalStrings.Hidden %>',
                        width: '10%',
                        type: 'checkbox',
                        values: { 'false': 'NO', 'true': 'YES' },
                        defaultValue: 'false',
                        sorting: false
                    },
                    Edit: {
                        title: '',
                        width: '1%',
                        display: function (data) {
                            return '<a title="Cập nhật" href="Edit.aspx?id=' + data.record.Id + '"><i class="fa fa-2x fa-edit"></i></a>';
                        },
                        sorting: false
                    },
                    Delete: {
                        title: '',
                        width: '1%',
                        display: function (data) {
                            return '<a title="Xóa" href="#" onclick="deleteClick(' + data.record.Id + ',\'' + escape(data.record.Name) + '\')" data-toggle="modal" data-target="#myModal"><i class="fa fa-2x fa-trash-o"></i></a>';
                        },
                        sorting: false
                    }
                }
            });

            //Re-load records when user click 'load records' button.
            $('#LoadRecordsButton').click(function (e) {
                e.preventDefault();
                $('#SuppliersTableContainer').jtable('load', {
                    name: $('#name').val(),
                    supplierGroupId: $('#<% = ddlSupplierGroups.ClientID %>').val()
                });
            });
            
            // Reset button
            $('#ResetButton').click(function (e) {
                e.preventDefault();
                $('#name').val('');
                $('#<% = ddlSupplierGroups.ClientID %>').val('0');
                $('#LoadRecordsButton').click();
            });

            //Load all records when page is first shown
            $('#LoadRecordsButton').click();
        });

        var selectedId = 0;
        function deleteClick(delId, delName) {
            selectedId = delId;
            $('#confirmMessage').html('Bạn có chắc chắn xóa: ' + unescape(delName) + '?');
        }

        function deleteItem() {
            $.ajax({
                type: "POST",
                url: "List.aspx/DeleteSupplier",
                data: JSON.stringify({ Id: selectedId }),
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                success: function (data) {
                    $('#LoadRecordsButton').click();
                },
                failure: function (errMsg) {
                    alert(errMsg);
                }
            });
        }
    </script>
</asp:Content>
